<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8" />
		<title>常用指令</title>
		<script type="text/javascript" src="../js/vue.js"></script>
	</head>
	<body>
		<!-- 
				常用内置指令
						v-text 		:  更新元素的 innerText
						v-html 		:  更新元素的 innerHTML
						v-if 	 		:  条件渲染（动态控制节点是否存存在）
						v-else 		:  条件渲染（动态控制节点是否存存在）
						v-show 		:  条件渲染 (动态控制display)
						v-for  		:  遍历数组/对象/字符串
						v-on   		:  绑定事件监听, 可简写为@
						v-bind:xxx : 单向绑定解析表达式, 可简写为 :xxx
						v-model		: 双向数据绑定
		 -->
		<!-- 准备好一个容器-->
		<div id="root">
			<h2 v-daxie="a"></h2>
			<div v-html="b"></div>
		</div>
	</body>

	<script type="text/javascript">
		Vue.config.productionTip = false

		new Vue({
			el:'#root',
			data:{
				a:'atguigu',
				b:'<a href="https://www.baidu.com">点我去百度</a>'
			}
		})
	</script>
</html>